<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的分享</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <style>
        body,html {height: 100%;background: rgba(0, 0, 0, 0);}
        header {width: 100%;height: 100vh;}
        .fxTitle{font-size: 16px;color: #d81e06;text-align: center;}
        footer {box-sizing: border-box;width: 100%;padding: 0 0;position: fixed;width: 100%;z-index: 99889}
        footer div {padding: 15px;background: #fff;border-radius:15px 15px 0 0;}
        footer span {font-size: 14px;font-weight: bolder;width: 100%;text-align: center;margin-bottom: 10px;}
        footer ul {display: flex;justify-content: space-around;align-items: center;}
        footer ul li{width: 25%;}
        footer li span{font-size:12px !important;font-weight: normal;color: #000;}
        footer li img {width: 60%;margin: 5px 20%;}
    </style>
</head>
<body>
    <header onclick="back()" tapmode=""></header>
    <footer>
        <div>
            <span class="fxTitle">分享</span>
            <ul>
                <li onclick="wxFx(1)">
                    <img src="../../image/share_icon_wechat.png" alt="">
                    <span>微信好友</span>
                </li>
                <li onclick="wxFx(1)">
                    <img src="../../image/share_icon_weixinqun.png" alt="">
                    <span>微信群</span>
                </li>
                <li onclick="wxFx(0)">
                    <img src="../../image/share_icon_circleoffriends.png" alt="">
                    <span>朋友圈</span>
                </li>
                <!-- <li onclick="wxFx()">
                    <img src="../../image/share_icon_haibao.png" alt="">
                    <span>分享海报</span>
                </li> -->
            </ul>
        </div>
    </footer>

</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/qrcode.min.js"></script>
<script type="text/javascript" src="../../script/html2canvas.js" charset="utf-8"></script>
<script type="text/javascript">
    let wx, sharedModule;
    var trans;
    apiready = function () {
        $api.dom('footer').style.bottom = api.safeArea.bottom + 0 + 'px';
        wx = api.require('wx');
        trans = api.require('trans');
        sharedModule = api.require('shareAction');

        setTimeout(() => {
            api.setFrameAttr({
                name: 'me_fx',
                bgColor: "rgba(0,0,0,0.1)",
            });
        }, 300);
    }
    function back() {
        api.setFrameAttr({
            name: 'me_fx',
            bgColor: "rgba(0,0,0,0)",
        });
        api.closeFrame({
        });
    }
    function wxFx(type) {
        //获取分享域名
        $api.ajax({
            url: 'api/Member/share_url',
            method: 'get',
        }, function (ret) {
            if(type == 1 || type == 0){  //微信分享
                wx.shareWebpage({
                    apiKey: '',
                    scene: type ? 'session' : 'timeline',  //微信会话、朋友圈
                    title: api.getGlobalData({key: 'member_info'}).nick_name + "邀你0元抢，领券省钱，超高补贴",
                    description: "",
                    thumb: '../../image/sheng.png',
                    contentUrl: ret.data.share_url + "api/oauth/share?sign=" + api.getGlobalData({
                        key: 'member_info'
                    }).sign,
                }, function (ret, err) {
                    if (ret.status) {
                        api.toast({
                            msg: '分享成功',
                            duration: 3000,
                            location: 'middle'
                        });
                    } else {
                        api.toast({
                            msg: '分享失败',
                            duration: 3000,
                            location: 'middle'
                        });
                    }
                });
            }else if(type == '' || type == undefined){  //海报
                var canvas = document.createElement("canvas");
                canvas.width = 375;
            		canvas.height = 667;
            		var context = canvas.getContext("2d");
            		context.rect(0 , 0 , canvas.width , canvas.height);
            		context.fillStyle = "#fff";
            		context.fill();
            		var myImage = new Image();
            		myImage.src = '../../image/share/appShare.png';    //背景图片  你自己本地的图片或者在线图片
            		myImage.crossOrigin = 'Anonymous';
          		  myImage.onload = function(){
        			      context.drawImage(myImage , 0 , 0 , 375 , 667);
                    var ercodeurl=ret.data.share_url+"api/oauth/share?sign="+api.getGlobalData({key:'member_info'}).sign;
                    //生成二维码
                    var qrcode = new QRCode(document.getElementById('ercode'), {
                      	text: ercodeurl,
                      	width: 256,
                      	height: 256,
                      	colorDark : "#000000",
                      	colorLight : "#ffffff",
                      	correctLevel : QRCode.CorrectLevel.L
                    });
              			var myImage2 = new Image();
              			myImage2.src = '../../image/share/appShare.png';   //你自己本地的图片或者在线图片
              			myImage2.crossOrigin = 'Anonymous';
              			myImage2.onload = function(){
              				  context.drawImage(document.getElementById('ercode').children[0], 110 , 273 , 152 , 152);
                        //贴logo
                        var myImage3 = new Image();
                  			myImage3.src = '../../image/share/shareLogo.png';   //你自己本地的图片或者在线图片
                  			myImage3.crossOrigin = 'Anonymous';
                  			myImage3.onload = function(){
                    				context.drawImage(myImage3,167, 329 , 38 , 38);
                            var createImg = canvas.toDataURL("image/png");
                            createImg = createImg.replace('data:image/png;base64,','');
                            // trans.saveImage({
                            //     base64Str:createImg,
                            //     album:true,
                            //     imgPath:"fs://img/",
                            //     imgName:"yaoqing.png"
                            // }, function(ret, err) {
                            //     if (ret.status) {
                            //         wx.shareImage({
                            //           apiKey: '',
                            //           scene: 'session',
                            //           thumb: 'fs://img/logooo.png',
                            //           contentUrl: 'fs://img/logooo.png'
                            //         }, function(ret, err) {
                            //           if (ret.status) {
                            //               alert('分享成功');
                            //           } else {
                            //               alert(JSON.stringify(err));
                            //           }
                            //         });
                            //     } else {
                            //         api.toast({
                            //             msg: '制作海报失败，请使用其他方式分享',
                            //             duration: 3000,
                            //             location: 'middle'
                            //         });
                            //     }
                            // });
                			  }
            			  }
            	  }
            }
        })
    }

    function share() {
        sharedModule.share({
            text: '请点击打开零元购：' + api.getGlobalData({
                key: 'config_info'
            }).share_url + "api/oauth/share?sign=" + api.getGlobalData({
                key: 'member_info'
            }).sign,
            type: 'text'
        });
    }
</script>

</html>
